<template>
  <div>
    <div>
      <div class="config_hee_opt">
        <el-header style="background-color: #dbd0ef">TEE端信息</el-header>
        <el-descriptions title="设备基本信息" :column="3" border>
          <el-descriptions-item label="是否有 CPU">
            <el-tag>{{ heePac.teeDeviceCpu ? '有CPU' : '无CPU' }}</el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="MAC 地址">{{ heePac.teeDeviceMac }}</el-descriptions-item>
          <el-descriptions-item label="设备 SN" :span="2">{{ heePac.teeDeviceSN }}</el-descriptions-item>
          <el-descriptions-item label="软件版本号" :span="2">{{ heePac.teeDeviceSoftWare }}</el-descriptions-item>
          <el-descriptions-item label="硬件版本号" :span="2">{{ heePac.teeDeviceHardWare }}</el-descriptions-item>
          <el-descriptions-item label="厂商单板名称" :span="2">{{ heePac.teeBoardname }}</el-descriptions-item>
          <el-descriptions-item label="g.metro模式">{{ heePac.teeOptModNameType }}</el-descriptions-item>
        </el-descriptions>
        <el-row>
          <el-col :span="12" style="padding-right: 5px">
            <div class="tee_info_class">
              <el-header style="background-color: #d8e8fc">LINE侧信息</el-header>
              <el-descriptions title="DDM信息" :column="2" border>
                <el-descriptions-item>
                  <template slot="label">输入光功率</template>
                  {{ heePac.teeLineDdmInfoPac.inputPower }}
                  <i>dBm</i>
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">输出光功率</template>
                  {{ heePac.teeLineDdmInfoPac.outputPower }}
                  <i>dBm</i>
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">温度</template>
                  {{ heePac.teeLineDdmInfoPac.temperature }}
                  <i>℃</i>
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">偏置电流</template>
                  {{ heePac.teeLineDdmInfoPac.biasCurrent }}
                  <i>mA</i>
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">电压</template>
                  {{ heePac.teeLineDdmInfoPac.voltage }}
                  <i>V</i>
                </el-descriptions-item>
              </el-descriptions>
              <el-descriptions title="光模块供应商信息" :column="2" border>
                <el-descriptions-item>
                  <template slot="label">名称</template>
                  {{ heePac.teeLineVendorPac.optModVendorName }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">版本</template>
                  {{ heePac.teeLineVendorPac.optModVendorRev }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">PN</template>
                  {{ heePac.teeLineVendorPac.optModVendorPN }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">SN</template>
                  {{ heePac.teeLineVendorPac.optModVendorSN }}
                </el-descriptions-item>
              </el-descriptions>
            </div>
          </el-col>
          <el-col :span="12" style="padding-left: 5px">
            <div class="tee_info_class">
              <el-header style="background-color: #f5f0f8">Client侧信息</el-header>
              <el-descriptions title="DDM信息" :column="2" border>
                <el-descriptions-item>
                  <template slot="label">输入光功率</template>
                  {{ heePac.teeClientDdmInfoPac.inputPower }}
                  <i>dBm</i>
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">输出光功率</template>
                  {{ heePac.teeClientDdmInfoPac.outputPower }}
                  <i>dBm</i>
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">温度</template>
                  {{ heePac.teeClientDdmInfoPac.temperature }}
                  <i>℃</i>
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">偏置电流</template>
                  {{ heePac.teeClientDdmInfoPac.biasCurrent }}
                  <i>mA</i>
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">电压</template>
                  {{ heePac.teeClientDdmInfoPac.voltage }}
                  <i>V</i>
                </el-descriptions-item>
              </el-descriptions>
              <el-descriptions title="光模块供应商信息" :column="2" border>
                <el-descriptions-item>
                  <template slot="label">名称</template>
                  {{ heePac.teeClientVendorPac.optModVendorName }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">版本</template>
                  {{ heePac.teeClientVendorPac.optModVendorRev }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">PN</template>
                  {{ heePac.teeClientVendorPac.optModVendorPN }}
                </el-descriptions-item>
                <el-descriptions-item>
                  <template slot="label">SN</template>
                  {{ heePac.teeClientVendorPac.optModVendorSN }}
                </el-descriptions-item>
              </el-descriptions>
            </div>
          </el-col>
        </el-row>
        <div class="config_hee_c">
          <el-form
              :model="heePac"
              :rules="rules"
              ref="ruleForm"
              label-width="120px"
              class="config_form">
            <!--          <el-header style="background-color: #c7c7c7">TEE端可配置信息</el-header>-->
            <el-row>
              <el-col :span="8">
                <el-form-item label="g.metro模式" prop="source">
                  <el-select v-model="heePac.teeOptModNameType">
                    <el-option value="NULL"></el-option>
                    <el-option value="HEE"></el-option>
                    <el-option value="TEE"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="LINE侧端口环回" prop="source">
                  <el-select v-model="heePac.teeLineloopback">
                    <el-option
                        v-for="(i, index) in loopback"
                        :key="index"
                        :value="i.value"
                        :label="i.label">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="升级选择" prop="source">
                  <el-select v-model="heePac.teeUpDate">
                    <el-option value="END"></el-option>
                    <el-option value="START"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <div>
              <el-form-item style="align:right">
                <el-button type="primary" @click="submitForm('ruleForm')">确认</el-button>
                <el-button @click="resetForm('ruleForm')">重置</el-button>
              </el-form-item>
            </div>

          </el-form>
        </div>

      </div>
    </div>
  </div>
</template>

<script>
import {loopback} from "@/assets/config/Troubleshooting";

export default {
  name: "HeePac",
  data() {
    return {
      loopback,
      heePac: {
        "teeDeviceCpu": true,
        "teeDeviceMac": "de-23-fd-45",
        "teeDeviceSN": "1578-g45f",
        "teeDeviceSoftWare": "v1.0.1.2.3.6",
        "teeDeviceHardWare": "per2022.1.00.1",
        "teeBoardname": "OTN2X8",
        "teeLinePtpName": "",
        "teeClientPtpName": "",

        // Enum： - UNKNOW - WHITELIGHT - CWDM - DWDM - G_METRO
        "teeLineOptModType": "CWDM",
        "teeClientOptModType": "",
        //SDH 信号类型 STM1 STM4 STM16 STM64 STM256
        "teeClientSignalType": "",
        "teeLineDdmInfoPac": {
          "inputPower": "9800",
          "outputPower": "8800",
          "temperature": "56.2",
          "biasCurrent": "10.5",
          "voltage": "88",
        },
        "teeClientDdmInfoPac": {
          "inputPower": "13000",
          "outputPower": "12000",
          "temperature": "36.5",
          "biasCurrent": "87.9",
          "voltage": "134",
        },
        "teeLineVendorPac": {
          "optModVendorName": "hctel",
          "optModVendorPN": "12gd-4235d023h2n",
          "optModVendorSN": "fhsahf-4324dss",
          "optModVendorRev": "1.2.3",
        },
        "teeClientVendorPac": {
          "optModVendorName": "hctel",
          "optModVendorPN": "23213.3123",
          "optModVendorSN": "2343.af",
          "optModVendorRev": "1.2.4",
        },
        //可设置项
        //TEE端g.metro模式名称
        // Enum：- NULL   - HEE    - TEE
        "teeOptModNameType": "HEE",
        //TEE端LINE侧端口环回
        "teeLineloopback": "NON_LOOPBACK",
        //TEE端升级
        // Enum： - END - START
        "teeUpDate": "END",
      },
    };
  },
};
</script>

<style>
.config_hee_opt {
  width: 900px;
  height: auto;
}

.config_hee_c{
  border: #a8a7a7 2px solid;
  border-radius: 20px;
  padding-top: 10px;
  padding-right: 5px;

  margin-top: 10px;
}
.tee_info_class{
  border: #a8a7a7 1px solid;
}

.basic_label {
  width: 110px !important;
}
</style>